<template>
<div class="song_wrapper">
  <div class="song_list">
   <li v-for="item in musicList">
     <a href="javascript:;" @click="playMusic(item.id)"></a>
     <b>{{item.name}}</b>
     <span v-if="item.mvid!=0" @click="playMV(item.mvid)"><i></i></span>
   </li>
 </div>
</div>
 
</template>

<script>
import { request } from '../network/request'

 export default {
   data () {
     return {

     }
   },
   props: {
     musicList: []
   },
   methods: {
     // 点击播放
     playMusic: function(musicId) {
       // 获取歌曲地址
       request({
         url: 'proxy/song/url?id='+musicId,
         methods: 'GET'
       }).then(res =>{
         this.$emit("musicUrlBind", res.data.data[0].url)
       }).catch(err => {

       });
       // 获取歌曲详情
       request({
         url: 'proxy/song/detail?ids='+musicId,
         methods: 'GET'
       }).then(res =>{
         this.$emit("picBind", res.data.songs[0].al.picUrl)
       })
       // 获取歌曲热门评论
       request({
         url: 'proxy/comment/hot?type=0&id='+musicId,
         methods: 'GET'
       }).then(res =>{
         this.$emit("commentBind", res.data.hotComments)
       })
     },
     // 播放MV
     playMV(mvid) {
       request({
         url: 'proxy/mv/url?id='+mvid,
         methods: 'GET'
       }).then(res => {
         this.$emit("mvUrlBind", res.data.data.url)
         this.$emit("isShowMVBind", true)
       })
     }
   },
   components: {

   }
 }
</script>

<style>

 
</style>
